<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title></title>
    <!-- 引入jquery CDN -->
    <script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
    <style>
        .normal {
            font-family: Arial, sans-serif;
        }

        .italic {
            font-family: "Times New Roman", Times, serif;
            font-style: italic;
        }

        .bold {
            font-family: "Courier New", Courier, monospace;
            font-weight: bold;
        }
    </style>
</head>

<body>
    <h1>第{{chapter_id}}章 {{chapter_name}}</h1>
    <h2>字数:{{total_words}}</h2>
    <p id="myText" class="normal" style="white-space: pre-wrap;">{{text}}</p>
    <button onclick="changeStyle('normal')">Normal</button>
    <button onclick="changeStyle('italic')">Italic</button>
    <button onclick="changeStyle('bold')">Bold</button>
    <script src="http://8.141.12.238:8083/js/chapter_read/script.js"></script>
    <button class="btn-change1" onclick="change_1()">上一章</button>
    <button class="btn-change2" onclick="change_2()">下一章</button>
</body>

</html>